<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="renderer" content="webkit|ie-comp|ie-stand">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta http-equiv="Cache-Control" content="no-siteapp"/>
    <title>合同表</title>
    <script src="../../../static/kaige/js/szload.js"></script>
    <style>
        .layui-form-radio {
            margin: 0px !important;
        }
    </style>
</head>

<body>
<div class="kaige-body">
    <table class="layui-table" id="pageTable" lay-filter="pageTable" lay-size="sm"></table>
    <input type="hidden" name="keywordsCache" value="{}"/>
</div>
<script src="/../../../../pc/static/lib/jquery-3.6.0.min.js"></script>
<script>
    let jq = jQuery.noConflict();
    load_init_js([
        szoapcpath + '/static/kaige/js/date.js',
        szoapcpath + '/static/kaige/js/search.js',
        szoapcpath + '/static/kaige/js/xm-select.js'
    ], function () {
        layui.config({
            base: szoapcpath + '/static/kaige/layuiextend/',
            version: Date.now(),
        }).use(['element', 'table', 'form', 'layer', 'kaige', 'laydate', 'xmSelect', 'laytpl', 'glfiles', 'lvybtpl', 'contract'], function () {
            var lvybtpl = layui.lvybtpl,
                element = layui.element,
                layer = layui.layer,
                table = layui.table,
                form = layui.form,
                kaige = layui.kaige,
                laydate = layui.laydate,
                xmSelect = layui.xmSelect,
                laytpl = layui.laytpl,
                glfiles = layui.glfiles,
                contract = layui.contract,
                $ = layui.$;

            window.kaige_page = {
                logout_url: '/index/logout',
                welcome: './pages/welcome.html',
                menus: [],
                leftmenu: [],
            };
            window.pagedict = parent.window.kaige_page.dict || {};

            form.render();

            kaige.table({
                elem: '#pageTable',
                url: "/crm.contract/index",
                id: 'pageTable',
                toolbar: '#dtoolbar',
                defaultToolbar: ['filter'],
                cols: [[
                    {field: 'id', title: '', align: 'center'},
                    {field: 'num', title: '合同编号', align: 'center'},
                    {field: 'name', title: '合同名称', align: 'center'},
                    {field: 'customer_id_name', title: '客户名称', align: 'center'},
                    {field: 'order_date', title: '下单时间', align: 'center'},
                    {field: 'money', title: '合同金额', align: 'center'},
                    {field: 'start_time', title: '开始时间', align: 'center'},
                    {field: 'end_time', title: '结束时间', align: 'center'},
                    {field: 'remarks', title: '备注', align: 'center'},
                    {title: '操作', toolbar: '#dtrbar', align: 'center', width: 150, fixed: 'right'}
                ]]
            });

            //列表-监听表头工具栏事件dtoolbar
            table.on('toolbar(pageTable)', function (obj) {
                switch (obj.event) {
                    case 'btn-add':
                        btnadd();
                        break;
                }
            });

            //列表-监听单元格行工具事件dtrbar
            table.on('tool(pageTable)', function (obj) {
                var that = this;
                var data = obj.data;
                switch (obj.event) {
                    case 'edit':
                        baredit(data);
                        break;
                    case 'del':
                        bardel(data);
                        break;
                    case 'record':
                        recordEvent(data);
                        break;
                    case 'receivables':
                        receivablesEvent(data);
                        break;
                }
            });

            table.on('row(pageTable)', function (obj) {
                var data = obj.data;
                showDetail(data);
            });

            window.delItem = function (obj) {
                $(obj).parent("td").parent("tr").remove();
            }
            window.reBuildNum = function () {
                var old_num = $("#num").val();
                $.post('/crm.contract/rebuildNum', {old_num: old_num}, function (res) {
                    if (res.status === false) {
                        layer.msg(res.msg);
                    } else {
                        $("#num").val(res.data);
                    }
                });
            }
            window.showProduct = function () {
                $("[lay-event]").each(function (index, item) {
                    var f = $(item).attr('lay-event');
                    $(item).bind('click', function () {
                        eval(f);
                    });
                });
                $("#showItemContents").find("tr").each(function (index, item) {
                    var idname = 'product_id_' + index;
                    var v = $("#" + idname).val();
                    var disabled = false;
                    if (v != "") {
                        disabled = true;
                    }
                    lvybtpl.xmSelect({
                        url: '/crm.product/getAllProduct'
                        , id: idname
                        , getData: {automatch: 1}
                        , values: [v]
                        , disabled: disabled
                        , changeafter: function (check_data) {
                            $.post("/crm.product/getProductPrice", {id: check_data[0].value}, function (productres) {
                                $("#price_" + index).val(productres.price);
                            });
                        }
                    });

                });
            }
            window.addProductEvent = function () {
                var index = $("#showItemContents").find("tr").length;
                var data = {};
                data.index = index;
                var getTpl = $("#itemContent").html();
                var view = $('#showItemContents');
                laytpl(getTpl).render(data, function (html) {
                    console.log(html);
                    view.append(html);
                    showProduct();
                });
            }

            window.showDetail = function (data) {
                var temp = {};
                temp['pagedict'] = pagedict;
                var detailData = $.extend(temp, data);
                lvybtpl.ajaxTab({
                    jq: jq,
                    type: 'get',
                    url: szoa.client.path + '/pages/crm/contract/detail.html',
                    width: '80%',
                    height: '100%',
                    id: 'detail',
                    detailData: detailData,
                    contentTable: 'recordTable',
                    callafter: function () {
                        // 获取跟进数据
                        contract.getRecord();
                        element.on('tab(detailCard)', function (data) {
                            //得到当前Tab的所在下标
                            if (data.index == 2) {
                                contract.getReceivablesPlan();
                            }
                            if (data.index == 3) {
                                contract.getReceivables();
                            }
                        });
                        $("[lay-event]").each(function (index, item) {
                            var f = $(item).attr('lay-event');
                            $(item).bind('click', function () {
                                eval(f);
                            });
                        });
                    }
                });
            };
            window.addEditData = function () {
                laydate.render({
                    elem: '#order_date'
                    , type: 'date'
                });
                laydate.render({
                    elem: '#start_time'
                    , type: 'date'
                });
                laydate.render({
                    elem: '#end_time'
                    , type: 'date'
                });
                var customer_id = $("#customer_id").val();
                var disabled = false;
                if (customer_id != '') {
                    disabled = true;
                }
                lvybtpl.xmSelect({
                    url: '/crm.customer/getAllCustomer'
                    , id: 'customer_id'
                    , getData: {automatch: 1}
                    , values: [customer_id]
                    , disabled: disabled
                    , changeafter: function (v) {
                        $("#contacts_id_select_box").html("");
                        lvybtpl.xmSelect({
                            url: '/crm.contacts/getByCustomer'
                            , id: 'contacts_id'
                            , getData: {automatch: 1, customer_id: v[0].value}
                        })
                    }
                    , setafter: function (v) {
                        var contacts_id = $('#contacts_id').val();
                        var disabled = false;
                        if (contacts_id != '') {
                            disabled = true;
                        }
                        $("#contacts_id_select_box").html("");
                        lvybtpl.xmSelect({
                            url: '/crm.contacts/getAll'
                            , id: 'contacts_id'
                            , getData: {automatch: 1, customer_id: customer_id}
                            , disabled: disabled
                            , values: [contacts_id]
                        })
                    }
                });

                kaige.xmSelect({
                    id: 'order_user_id',
                    url: '/select/employee',
                    udata: {automatch: 1},
                    radio: true,
                    clickClose: true
                });

                kaige.xmSelect({
                    id: 'company_id',
                    url: '/select/company',
                    udata: {automatch: 1},
                    radio: true,
                    clickClose: true
                });

                showProduct();

            }

            //添加
            function btnadd() {
                lvybtpl.form({
                    url: "/crm.contract/add",
                    data: {},
                    id: 'kaige',
                    area: ['750px', '650px'],
                    title: '<i class="layui-icon layui-icon-add-circle"></i> 添加 - 合同表',
                    tablelayid: 'pageTable',
                    overflow: false,
                    encode: 1,
                    tplbefore: function (res) {
                        res.data.product_list = [];
                        var t = {};
                        t.price = "";
                        t.num = "";
                        res.data.product_list.push(t);
                    },
                    callbefore: function (layero, index) {
                        addEditData();
                    }
                    , postbefore: function (updata) {
                        updata.files_id = updata.form_files_id;
                        delete updata.form_files_id;
                        return updata;
                    }
                    , getdata: function (res) {
                        var data = (res && res.data && res.data.fi) ? res.data.fi : null;
                        glfiles.form({
                            id: 'form',
                            is_edit: true,
                            data: data
                        });
                    }
                });
            }

            //编辑
            function baredit(d) {
                kaige.form({
                    url: "/crm.contract/edit",
                    data: {id: d.id},
                    id: 'kaige',
                    area: ['750px', '650px'],
                    title: '<i class="layui-icon layui-icon-edit"></i> 编辑 - 合同表',
                    tablelayid: 'pageTable',
                    overflow: false,
                    encode: 1,
                    callbefore: function (layero, index) {
                        addEditData();
                    }
                    , postbefore: function (updata) {
                        updata.files_id = updata.form_files_id;
                        delete updata.form_files_id;
                        return updata;
                    }
                    , getdata: function (res) {
                        var data = (res && res.data && res.data.fi) ? res.data.fi : null;
                        glfiles.form({
                            id: 'form',
                            is_edit: true,
                            data: data
                        });
                    }
                });
            }

            //删除
            function bardel(d) {
                layer.confirm('您确定删除吗？', {
                    title: '<i class="layui-icon layui-icon-delete"></i> 删除确认',
                    btn: ['确认', '取消']
                }, function () {
                    $.post("/crm.contract/del", {id: d.id}, function (res) {
                        res.status && table.reload('pageTable');
                        layer.msg(res.msg);
                    });
                });
            };
        })
        ;
    })
    ;
</script>
<script type="text/html" id="dtrbar">
    <div class="layui-btn-group">
        <button class="layui-btn layui-btn-xs" lay-event="edit" title="编辑">编辑
        </button>
        <button class="layui-btn layui-btn-xs" lay-event="del" title="删除">删除
        </button>
    </div>
</script>
<script type="text/html" id="dtoolbar">
    <div class="layui-btn-container layui-form filter-form" lay-filter="searchform">
        <div class="layui-btn-group">
            <button type="button" class="layui-btn layui-btn-sm" lay-event="btn-add" style="margin-top:2px;"><i
                    class="layui-icon layui-icon-add-circle"></i> 添加
            </button>
        </div>
    </div>
</script>

<script id="itemContent" type="text/html">
    <tr>
        <td>
            <div id="product_id_{{ d.index }}_select_box"></div>
            <input id="product_id_{{ d.index }}" name="product_id_{{ d.index }}"
                   value="{{ d.product_id || '' }}"
                   class="layui-input"
                   type="hidden">
            <input id="product_id_{{ d.index }}_name" name="product_id_{{ d.index }}_name"
                   value="{{ d.product_id_name || '' }}"
                   class="layui-input" type="hidden">
        </td>
        <td>
            <input type="text" class="layui-input" name="num_{{ d.index }}" value="{{ d.num || '' }}"
                   id="num_{{ d.index }}"/>
        </td>
        <td>
            <input type="text" class="layui-input" name="price_{{ d.index }}" value="{{ d.price || '' }}"
                   id="price_{{ d.index }}" readonly/>
        </td>
        <td>
            <button type="button" class="layui-btn layui-btn-sm"
                    lay-event="delItem(this);">删除
            </button>
        </td>
    </tr>
</script>

<script type="text/html" id="kaige_form_html">
    <form class="layui-form layui-form-pane kaige-body-form" style="padding: 5px;" lay-filter="kaige_form_lay_filter">
        {{# if(d.id){ }}
        <input type="hidden" name="id" value="{{ d.id }}"/>
        {{# } }}
        <div class="layui-tab">
            <ul class="layui-tab-title">
                <li class="layui-this">基础信息</li>
                <li>产品信息</li>
            </ul>
            <div class="layui-tab-content">
                <div class="layui-tab-item layui-show">
                    <div class="layui-form-item">
                        <label class="layui-form-label">合同名称</label>
                        <div class="layui-input-inline">
                            <input name="name" value="{{ d.name || '' }}" class="layui-input" type="text"
                                   lay-verify="required">
                        </div>
                        <label class="layui-form-label">合同编号</label>
                        <div class="layui-input-inline">
                            <input id="num" name="num" value="{{ d.num || '' }}" class="layui-input" type="text"
                                   lay-verify="required" readonly>
                            <button type="button" class="layui-btn layui-btn-sm" lay-event="reBuildNum();"
                                    style="position: absolute;right: 0px;bottom: 0px;height: 36px;">生成
                            </button>
                        </div>
                    </div>

                    <div class="layui-form-item">
                        <label class="layui-form-label">合同金额</label>
                        <div class="layui-input-inline">
                            <input id="money" name="money" value="{{ d.money || '' }}" class="layui-input" type="text"
                                   disabled="disabled">
                        </div>
                        <label class="layui-form-label">下单时间</label>
                        <div class="layui-input-inline">
                            <input id="order_date" name="order_date" value="{{ d.order_date || '' }}"
                                   class="layui-input"
                                   type="text" lay-verify="required">
                        </div>
                    </div>

                    <div class="layui-form-item">
                        <label class="layui-form-label">定金</label>
                        <div class="layui-input-inline">
                            <input id="deposit" name="deposit" value="{{ d.deposit || '0.00' }}" class="layui-input"
                                   type="text">
                        </div>
                        <label class="layui-form-label">货币</label>
                        <div class="layui-input-inline">
                            <select name="currency_type" lay-verify="required">
                                {{# lay.each(pagedict.currencyType,function(index,item){
                                if(index == ''){
                                top.layer.msg('系统字典->货币未配置完成，值不能为空');
                                }
                                }}
                                <option value="{{ index }}" {{ d.currency_type== index ?
                                'selected' :'' }}>{{ item }}</option>
                                {{# }) }}
                            </select>
                        </div>
                    </div>

                    <div class="layui-form-item">
                        <label class="layui-form-label">汇率</label>
                        <div class="layui-input-inline">
                            <input id="exchange" name="exchange" value="{{ d.exchange || '1.00' }}" class="layui-input"
                                   type="text">
                        </div>
                        <label class="layui-form-label">是否含税</label>
                        <div class="layui-input-inline">
                            <input type="radio" name="is_tax" value="1" title="含税" {{# if(d.is_tax=="1"){ }} checked {{#
                                   } }}>
                            <input type="radio" name="is_tax" value="2" title="不含税" {{# if(d.is_tax=="2"){ }} checked
                                   {{# } }}>
                        </div>
                    </div>

                    <div class="layui-form-item">
                        <label class="layui-form-label">开始时间</label>
                        <div class="layui-input-inline">
                            <input id="start_time" name="start_time" value="{{ d.start_time || '' }}"
                                   class="layui-input"
                                   type="text">
                        </div>
                        <label class="layui-form-label">结束时间</label>
                        <div class="layui-input-inline">
                            <input id="end_time" name="end_time" value="{{ d.end_time || '' }}" class="layui-input"
                                   type="text">
                        </div>
                    </div>

                    <div class="layui-form-item">
                        <label class="layui-form-label">公司[卖方]</label>
                        <div class="layui-input-inline">
                            <div id="company_id_select_box"></div>
                            <input type="hidden" id="company_id" value="{{ d.company_id || '' }}" name="company_id"
                            />
                            <input id="company_id_name" name="company_id_name" value="{{ d.company_id_name || '' }}"
                                   class="layui-input" type="hidden">
                        </div>

                        <label class="layui-form-label">订单签约人</label>
                        <div class="layui-input-inline">
                            <div id="order_user_id_select_box"></div>
                            <input type="hidden" id="order_user_id" value="{{ d.order_user_id || '' }}"
                                   name="order_user_id"
                            />
                            <input id="order_user_id_name" name="order_user_id_name"
                                   value="{{ d.order_user_id_name || '' }}"
                                   class="layui-input" type="hidden">
                        </div>

                    </div>

                    <div class="layui-form-item">
                        <label class="layui-form-label">客户</label>
                        <div class="layui-input-inline">
                            <div id="customer_id_select_box"></div>
                            <input type="hidden" id="customer_id" value="{{ d.customer_id || '' }}" name="customer_id"
                            />
                            <input id="customer_id_name" name="customer_id_name" value="{{ d.customer_id_name || '' }}"
                                   class="layui-input" type="hidden">
                        </div>

                        <label class="layui-form-label">客户签约人</label>
                        <div class="layui-input-inline">
                            <div id="contacts_id_select_box"></div>
                            <input id="contacts_id" name="contacts_id" value="{{ d.contacts_id || '' }}"
                                   class="layui-input"
                                   type="hidden">
                            <input id="contacts_id_name" name="contacts_id_name" value="{{ d.contacts_id_name || '' }}"
                                   class="layui-input" type="hidden">
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">产品描述</label>
                        <div class="layui-input-block">
                            <textarea placeholder="请输入合同描述" class="layui-textarea"
                                      name="remarks">{{ d.remarks || '' }}</textarea>
                        </div>
                    </div>
                    <div class="layui-form-item" id="form_files_gl_html"></div>
                </div>
                <div class="layui-tab-item">
                    <div class="layui-form-item">
                        <label class="layui-form-label">产品列表</label>
                        <div class="layui-input-block">
                            <button type="button" class="layui-btn layui-btn-sm" onclick="addProductEvent()"
                                    style="margin: 5px 20px;"><i
                                    class="layui-icon layui-icon-add-circle"></i> 追加
                            </button>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <table class="layui-table">
                            <thead>
                            <tr>
                                <td width="50%">名称</td>
                                <td width="20%">数量</td>
                                <td width="20%">价格</td>
                                <td width="10%">操作</td>
                            </tr>
                            </thead>
                            <tbody id="showItemContents">
                            {{# layui.each(d.product_list, function(index, item){ }}
                            <tr>
                                <td>
                                    <div id="product_id_{{ index }}_select_box"></div>
                                    <input id="product_id_{{ index }}" name="product_id_{{ index }}"
                                           value="{{ item.product_id || '' }}"
                                           class="layui-input"
                                           type="hidden">
                                    <input id="product_id_{{ index }}_name" name="product_id_{{ index }}_name"
                                           value="{{ item.product_id_name || '' }}"
                                           class="layui-input" type="hidden">
                                </td>
                                <td>
                                    <input type="text" class="layui-input" name="num_{{ index }}"
                                           value="{{ item.num || '' }}"
                                           id="num_{{ index }}"/>
                                </td>
                                <td>
                                    <input type="text" class="layui-input" name="price_{{ index }}"
                                           value="{{ item.price || '' }}"
                                           id="price_{{ index }}" readonly/>
                                </td>
                                <td>
                                    <button type="button" class="layui-btn layui-btn-sm"
                                            lay-event="delItem(this);">删除
                                    </button>
                                </td>
                            </tr>
                            {{# }); }}
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>

        <div class="layui-form-item layui-hide">
            <button class="layui-hide" lay-submit="" id="kaige_form_btn_save" lay-filter="kaige_form_btn_save">保存数据
            </button>
        </div>
    </form>
</script>
</body>

</html>